<template>
  <div></div>
</template>

<script>
import QRCode from "qrcodejs2";

export default {
  props: {
    value: {
      type: String,
      default: ""
    },
    width: {
      type: Number,
      default: 0
    },
    height: {
      type: Number,
      default: 0
    }
  },
  watch: {
    value(val) {
      if (this.qrcode) {
        this.qrcode.makeCode(val);
      }
    }
  },
  methods: {
    generate() {
      this.qrcode = new QRCode(this.$el, {
        text: this.value,
        width: this.width || this.$el.offsetWidth,
        height: this.height || this.$el.offsetHeight,
        correctLevel: QRCode.CorrectLevel.L
      });

      this.qrcode.makeCode(this.value);
    }
  },
  mounted() {
    this.generate();
  }
};
</script>
